<template>
	<view class="cidPjd">
		<view class="cidPjdMain">
			<view class="cidPjdMainHead">
				<view class="cidPjdMainHeadLeft">
					<view class="cidPjdMainHeadLeft-title">
						<image class="cidPjdMainHeadLeft-titleImg" src="https://www.zzzsyh.com/applets/agent/agent/house-three.png" mode=""></image>
						<text class="cidPjdMainHeadLeft-titleTxt">{{dat.storeName}}</text>
					</view>
					<view class="cidPjdMainHeadLeft-fuwu">
						<view class="cidPjdMainHeadLeft-fuwuLeft">
							服务承诺：
						</view>
						<view class="cidPjdMainHeadLeft-fuwuRight">
							<text class="cidPjdMainHeadLeft-fuwuRight-txt" v-for="(item, index) of storeService" :key="index">
								{{item}}
							</text>
						</view>
					</view>
				</view>
				<view class="cidPjdMainHeadRight">
					<!-- <image class="cidPjdMainHeadRight-img" :src=dat.storeImage mode=""></image> -->
					<image class="cidPjdMainHeadRight-img" src="https://www.zzzsyh.com/applets/agent/agent/head.png" mode=""></image>
					<!-- <view class="cidPjdMainHeadRight-li">
						浏览量
					</view>
					<view class="cidPjdMainHeadRight-li">
						{{dat.storePageviews}}
					</view> -->
				</view>
			</view>
			<view class="cidPjdMainAddress">
				<image class="cidPjdMainAddress-img" src="https://www.zzzsyh.com/applets/agent/agent/address-3.png" mode=""></image>
				<view class="cidPjdMainAddress-txt">
					{{dat.storeDetailAddress}}
				</view>
			</view>
			<view class="cidPjdMainTitle">
				商家信息
			</view>
			<view class="cidPjdMainList">
				<view class="cidPjdMainLi">
					<image class="cidPjdMainLi-img" src="https://www.zzzsyh.com/applets/agent/agent/pjd_1.png" mode=""></image>
					<view class="cidPjdMainLi-txt">
						{{dat.storePerson}}
					</view>
				</view>
				<view class="cidPjdMainLi">
					<image class="cidPjdMainLi-img" src="https://www.zzzsyh.com/applets/agent/agent/pjd_2.png" mode=""></image>
					<view class="cidPjdMainLi-txt">
						{{dat.storePhone}}
					</view>
				</view>
				<view class="cidPjdMainLi">
					<image class="cidPjdMainLi-img" src="https://www.zzzsyh.com/applets/agent/agent/pjd_3.png" mode=""></image>
					<view class="cidPjdMainLi-txt">
						{{dat.storeBusinessHours}}
					</view>
				</view>
				<view class="cidPjdMainLi">
					<image class="cidPjdMainLi-img" src="https://www.zzzsyh.com/applets/agent/agent/pjd_4.png" mode=""></image>
					<view class="cidPjdMainLi-txt">
						{{dat.storeProvinceName}} {{dat.storeCityName}} {{dat.storeDistrictName}}
					</view>
				</view>
				<view class="cidPjdMainLi">
					<image class="cidPjdMainLi-img" src="https://www.zzzsyh.com/applets/agent/agent/pjd_5.png" mode=""></image>
					<view class="cidPjdMainLi-txt">
						{{dat.storeOpenYears}}
					</view>
				</view>
				<view class="cidPjdMainLi">
					<image class="cidPjdMainLi-img" src="https://www.zzzsyh.com/applets/agent/agent/pjd_6.png" mode=""></image>
					<view class="cidPjdMainLi-txt">
						{{dat.storeContent}}
						<!-- <text class="cidPjdMainLi-txtBox" v-for="(item, index) of storeContent" :key="index">{{item}}</text> -->
					</view>
				</view>
				<!-- <view class="cidPjdMainLi">
					<image class="cidPjdMainLi-img" src="https://www.zzzsyh.com/applets/agent/agent/pjd_7.png" mode=""></image>
					<view class="cidPjdMainLi-txt">
						<text>专属小程序码</text>
						<image class="cidPjdMainLi-txtImg" src="https://www.zzzsyh.com/applets/agent/agent/right_six.png" mode=""></image>
					</view>
				</view> -->
				<view class="cidPjdMainTitle cidPjdMainTitleTwo">
					经营资质
				</view>
				<view class="cidPjdMainCertification">
					<image class="cidPjdMainCertificationImg" :src=item.storeLicense mode=""></image>
				</view>
			</view>
		</view>
		<view class="btnBox">
			<view class="btnB btnBox-false" @click="auditPartsStore(3)">
				驳回
			</view>
			<view class="btnB btnBox-ok" @click="auditPartsStore(2)">
				通过
			</view>
		</view>
	</view>
</template>

<script>
	import allapi from '../api/index.js'
	export default {
		data() {
			return {
				id: '',
				dat: {
					storeName: '',
				}
			}
		},
		onLoad(val) {
			console.log(11111,val);
			this.id = val.id
		},
		mounted() {
			this.getPartsStoreDetails()
		},
		computed: {
			storeService () {
				try{
					return this.dat.storeService.split(',')
				}catch(e){
					return []
				}
				// if () {
				// }
			},
		},
		methods: {
			// 审核配件店
			auditPartsStore (state) {
				uni.request({
					url: allapi.auditPartsStore,
					data: {
						id: this.id,
						state: state,
						reject: ''
					},
					success: (res) => {
						console.log(res);
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
						setTimeout( function () {
							uni.navigateBack()
						},1000)
					}
				})
			},
			// 得到配件点详情
			getPartsStoreDetails () {
				uni.request({
					url: allapi.getPartsStoreDetails,
					data: {
						id: this.id
					},success: (res) => {
						console.log(res);
						this.dat = res.data.data
					}
				})
			}
		}
	}
</script>

<style scoped>
	.cidPjd {
		background: linear-gradient(180deg, #FDD194 0%, #F6F6F6 100%);
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		display: flex;
		flex-direction: column;
	}
	.cidPjdMain {
		margin: 24rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
		padding: 40rpx 32rpx;
		padding-bottom: 80rpx;
		flex: 1;
		overflow: auto;
	}
	.cidPjdMainHead {
		display: flex;
		justify-content: space-between;
	}
	.cidPjdMainHeadLeft {
		flex: 1;
		display: flex;
		flex-direction: column;
		/* justify-content: space-between; */
	}
	.cidPjdMainHeadLeft-title {
		margin-top: 24rpx;
	}
	.cidPjdMainHeadLeft-titleImg {
		width: 42rpx;
		height: 42rpx;
		
	}
	.cidPjdMainHeadLeft-titleTxt {
		margin-left: 16rpx;
		font-size: 32rpx;
		color: #333333;
	}
	.cidPjdMainHeadLeft-fuwu {
		margin-top: 24rpx;
		display: flex;
		align-items: center;
	}
	.cidPjdMainHeadLeft-fuwuLeft {
		font-size: 24rpx;
		font-weight: 400;
		color: #666666;
		width: 120rpx;
	}
	.cidPjdMainHeadLeft-fuwuRight {
		flex: 1;
		display: flex;
		align-items: center;
	}
	.cidPjdMainHeadLeft-fuwuRight-txt {
		font-size: 24rpx;
		font-weight: 400;
		color: #EF691C;
		padding: 6rpx 8rpx;
		line-height: 34rpx;
		margin-left: 8rpx;
		background: #FEEFEA;
		border-radius: 8rpx;
	}
	.cidPjdMainHeadRight {
		display: flex;
		flex-direction: column;
	}
	.cidPjdMainHeadRight-img {
		width: 144rpx;
		height: 144rpx;
		border-radius: 50%;
		background: #EEEEEE;
	}
	.cidPjdMainHeadRight-li {
		font-size: 20rpx;
		color: #999999;
		font-weight: 400;
		line-height: 28rpx;
		margin-top: 8rpx;
		text-align: center;
	}
	.cidPjdMainAddress {		
		background: #F3F5F6;
		border-radius: 16rpx;
		padding: 26rpx 24rpx;
		display: flex;
		align-items: center;
		margin-top: 24rpx;
	}
	.cidPjdMainAddress-img {
		width: 32rpx;
		height: 32rpx;
	}
	.cidPjdMainAddress-txt {
		margin: 0 24rpx;
		flex: 1;
		font-size: 24rpx;
		font-weight: 400;
		color: #666666;
	}
	.cidPjdMainTitle {		
		line-height: 50rpx;
		color: #333333;
		font-size: 36rpx;
		margin-top: 40rpx;
		margin-left: 8rpx;
	}
	.cidPjdMainTitleTwo {
		margin-top: 64rpx;
	}
	.cidPjdMainList {
		margin-top: 34rpx;
	}
	.cidPjdMainLi {
		display: flex;
		align-items: center;
		margin-top: 24rpx;
	}
	.cidPjdMainLi-img {
		width: 36rpx;
		height: 36rpx;
	}
	.cidPjdMainLi-txt {
		flex: 1;
		margin: 0 30rpx;
		color: #333333;
		font-size: 28rpx;
		display: flex;
		align-items: center;
	}
	.cidPjdMainLi-txtBox {
		padding: 6rpx 8rpx;
		background: #F3F5F6;
		border-radius: 8rpx;
		line-height: 34rpx;
		display: block;
		margin-right: 10rpx;
	}
	.cidPjdMainLi-txtImg {
		width: 28rpx;
		height: 28rpx;
		margin-left: 10rpx;
	}
	.cidPjdMainCertification {
		height: 188rpx;
		margin-top: 32rpx;
	}
	.cidPjdMainCertificationImg {
		width: 304rpx;
		height: 188rpx;
		background: #EEEEEE;
	}
	.btnBox {
		min-height: 120rpx;
		background: #FFFFFF;
		display: flex;
		justify-content: space-around;
		align-items: center;
		box-sizing: border-box;
		padding:16rpx 0 24rpx;
		padding-bottom: calc(env(safe-area-inset-bottom) + 24rpx);
	}
	.btnB {
		width: 256rpx;
		height: 72rpx;
		line-height: 72rpx;
		text-align: center;
		font-size: 28rpx;
		color: #FFFFFF;
		border-radius: 36rpx;
	}
	.btnBox-false {
		background: linear-gradient(180deg, #F8BA70 0%, #FB862F 100%);
	}
	.btnBox-ok {
		background: linear-gradient(180deg, #F27E75 0%, #E22F48 100%);
	}
</style>
